<template>
  <div class="status-box text-center">
    <div v-if="status === 'success'" class="success-box">
      <i class="icon icon-success"></i>
      <h3>恭喜您，{{isAppay ? '报名' : '预约'}}成功！</h3>
      <p>工作人员会在24小时内联系您，请您保持电话畅通。</p>
    </div>
    <div v-else class="error-box">
      <i class="icon icon-fail"></i>
      <h3>操作失败！</h3>
    </div>
    <div class="btn-box text-center m-auto">
      <navigator url="/pages/order/main" open-type="reLaunch" class="btn-full radius" >查看订单</navigator>
      <navigator url="/pages/home/main" open-type="reLaunch" class="btn-light radius" >返回首页</navigator>
    </div>
  </div>
</template>
<script>

export default {
  data () {
    return {
      status: ''
    }
  },
  methods: {

  },
  mounted () {
    const query = this.$root.$mp.query
    this.status = query.status
  }
}
</script>

<style lang="less">
  .status-box{
    padding-top: 63px;
    .icon {
      width: 71px;
      height: 71px;
      margin-bottom: 37px;
    }
    h3{
      font-size: 18px;
      font-weight: bold;
      line-height: 1em;
      padding-bottom: 15px;
    }
  }
  .btn-box {
    padding-top: 70px;
    width: 200px;
    .btn-full{
      margin-bottom: 15px;
    }
  }

</style>
